<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html lang="zh-cn">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>订单提交成功</title>		
		<link rel="stylesheet" type="text/css" href="${ctxStatic}/IDH/css/make_order_success/make_order_success.css" />
		
	</head>
	<body>
		<!-- head start  -->
		<%@ include file="/WEB-INF/views/modules/marketHeader.jsp"%>
		<!-- head end  -->
		<!--content start-->
		<section class="container content">
			<form action="${ctxf}/pay/ali/forPay" method="post" name="payForm" id="payForm" target="_blank">
				<input type="hidden" id="coNum" name="coNum" value="${order.code }"/>
				<input type="hidden" id="txnAmt" name="txnAmt" value="${order.totalAmount }"><!--  -->
				
				<div class="col-xs-12">
					<div class="row">
						<div class="order_success">
							<div class="order_status">
								<div class="order_all_info">
									<p>订单号 ： <span class="order_number">${order.code }</span></p>
									<p>付款金额（元）：<span class="pay_money">${order.formatTotalAmount }</span>元</p>
									<p>请您在 <span class="order_pay_date">
										<span class="hide" id="createTime"><fmt:formatDate value="${order.createTime}" pattern="yyyy-MM-dd HH:mm:ss" /></span>
										<span id="mustPayTime"></span> 前完成支付，否则订单将自动取消
									</p>
								</div>
							</div>
							<div class="go_pay text-right hidden-xs">
								<div class="btn btn-primary wechatPay" onClick="onPayFormWX();">微信支付</div>
								<div class="btn btn-primary" onClick="onPayFormALi();">支付宝支付</div>
							</div>
							<div class="go_pay text-right visible-xs-block">
								<div class="btn btn-primary wechatPay" onclick="phonePay();">微信支付</div>
							</div>
							<div class="go_pay text-right visible-xs-block">
								<div class="btn btn-primary aliPay" onclick="onPhonePayFormALi();">支付宝支付</div>
							</div>
							<div class="clearBoth"></div>
						</div>
					</div>
				</div>
			</form>
		</section>
		
		<!--模态框 开始-->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header clearfix">
						<h4 class="modal-title" id="myModalLabel"></h4>
						<ul class="col-lg-6 col-xs-6">
							<li>收款方 ：霁圣商城</li>
							<li>订单号 ： ${order.code }</li>
						</ul>
						<ul class="col-lg-6 col-xs-6">
							<li>&nbsp;&nbsp;</li>
							<li class="text-right">金额 ： <span class="money">${order.totalAmount }</span> 元</li>
						</ul>
					</div>
					<div class="modal-body text-center">
						<h3 class="modal-title">微信扫码付款</h3>
						<%-- <img id="" alt="" src="${ctxStatic}/IDH/images/icon/weixinPay.jpg"> --%>
						<img id="qrcode" alt="" src="">
					</div>
					<div class="modal-footer" style="text-align:center">
						<a href="#" onclick="window.location.reload()">其他支付方式 >></a>
				    </div>
				</div>
			</div>
		</div>
		<!--模态框 结束-->
		<!--content end-->

		<!--footer start-->
		<%@ include file="/WEB-INF/views/modules/marketFooter.jsp"%>
		<!--footer end-->

	</body>
	<script type="text/javascript">
		$(document).ready(function(){
			var createTime = $("#createTime").html();
			var mustPayTime = new Date(Date.parse(createTime.replace(/-/g,"/"))).getTime() + 1800000;
			$("#mustPayTime").html(getNowDate(mustPayTime));
			
			//手机浏览器不显示微信支付按钮
			if( !is_weixn() &&  !IsPC()){
				$('.wechatPay').css('display','none')
			}else{
				$('.aliPay').css('display','none')
			}
		})
		setInterval("checkOrder()",5000);
		function checkOrder(){ 
			var coNum = $("#coNum").val();
			$.ajax({
				type: "POST",
				url:"${ctxf}/pay/wx/forCheck",
				async: false,
				data:{orderId:coNum},
				dataType: "json",
				success: function(data){
					
					if (data.canPay == false) {
						toastr.success("支付成功！");
						window.location.href="${ctxf}/userfront/toOrder";
					}
				}
			});
		} 
		function onPayFormWX(){
			var coNum = $("#coNum").val();
			var canPay = false;
			var url="${ctxf}/pay/wx/forCheck";
			$.ajax({
				type: "POST",
				url:url,
				async: false,
				data:{orderId:coNum},
				dataType: "json",
				success: function(data){
					canPay = data.canPay;
				},
			});
			if(!canPay){//判断是否允许支付
				toastr.info("该订单已支付!",{timeOut:1000});
				return false;
			} 
			$.ajax({
				type: "POST",
				url:"${ctxf}/pay/wx/forPay",
				async: false,
				data:{coNum:coNum,txnAmt:$("#txnAmt").val()},
				dataType: "json",
				success: function(data){
					if (data.msg == "success") {
						$("#qrcode").attr("src",data.path + data.picName);
						$('#myModal').modal("show");
					} else {
						layer.msg(data.msg);
					}
				}
			});
		}
		
		function onPayFormALi() {
			var canPay = false;
			var coNum = $("#coNum").val();
			var url="${ctxf}/pay/ali/forCheck";
			$.ajax({
				type: "POST",
				url:url,
				async: false,
				data:{orderId:coNum},
				dataType: "json",
				success: function(data){
					canPay = data.canPay;
				},
			});
			if(!canPay){//判断是否允许支付
				toastr.info("该订单已支付!",{timeOut:1000});
				return false;
			} else {
				$("#payForm").submit();
			}
		}
		function onPhonePayFormALi() {
			var canPay = false;
			var coNum = $("#coNum").val();
			var url="${ctxf}/pay/ali/forCheck";
			$.ajax({
				type: "POST",
				url:url,
				async: false,
				data:{orderId:coNum},
				dataType: "json",
				success: function(data){
					canPay = data.canPay;
				},
			});
			if(!canPay){//判断是否允许支付
				toastr.info("该订单已支付!",{timeOut:1000});
				return false;
			} else {
				$("#payForm").attr("action","${ctxf}/pay/ali/forMobilePay");
				$("#payForm").submit();
			}
		}
		function onBridgeReady() {
			var appId="";
			var timeStamp="";
			var nonceStr="";
			var package2="";
			var signType="";
			var paySign="";
			$.ajax({
				type: "POST",
				url:"${ctxf}/pay/wx/forMech",
				async: false,
				data:{txnAmt:$("#txnAmt").val(),coNum:$("#coNum").val()},
				dataType: "json",
				success: function(data){
					appId = data.appId;
					timeStamp = data.timeStamp;
					nonceStr = data.nonceStr;
					package2 = data.package2;
					signType = data.signType;
					paySign = data.paySign;
				},
			});
			WeixinJSBridge.invoke('getBrandWCPayRequest', {
					"appId":appId,     //公众号名称，由商户传入     
					"timeStamp":timeStamp,         //时间戳，自1970年以来的秒数     
					"nonceStr":nonceStr, //随机串     
					"package": package2,     
					"signType":signType,         //微信签名方式：   
					"paySign":paySign //微信签名 
				},
				function(res){   
					// 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回    ok，但并不保证它绝对可靠。
					if(res.err_msg == "get_brand_wcpay_request:ok" ) {
						layer.msg("支付成功!");
					} else if(res.err_msg == "get_brand_wcpay_request:fail" ){
						layer.msg("支付失败!");
					}  else{
						layer.msg("取消支付!");
					}  
				}
			); 
		}
		
		function phonePay() {
			$('#myModal').modal("show");
			if (typeof WeixinJSBridge == "undefined"){
				if( document.addEventListener ){
					document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
				}else if (document.attachEvent){
					document.attachEvent('WeixinJSBridgeReady', onBridgeReady); 
					document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
				}
			}else{
				onBridgeReady();
			}
		}
		
		//判断是否微信端
		function is_weixn(){  
		    var ua = navigator.userAgent.toLowerCase();  
		    if(ua.match(/MicroMessenger/i)=="micromessenger") {  
		        return true;  
		    } else {  
		        return false;  
		    }  
		}  
		
		//判断是否pc端
		function IsPC() {
		    var userAgentInfo = navigator.userAgent;
		    var Agents = ["Android", "iPhone",
		                "SymbianOS", "Windows Phone",
		                "iPad", "iPod"];
		    var flag = true;
		    for (var v = 0; v < Agents.length; v++) {
		        if (userAgentInfo.indexOf(Agents[v]) > 0) {
		            flag = false;
		            break;
		        }
		    }
		    return flag;
		}
	</script>
	
</html>